<template>
	<uv-loading-page 	:loading="loading" 
										:loading-text="loadingText + point" 
										:bgColor="bgColor" 
										font-size="24rpx"
										icon-size="300rpx"
										:image="image"
										></uv-loading-page>
</template>
<script>
	export default {
		data() {
			return {
				image: 'https://crazy3.top/jx3/images/wages/zdy_zt.png',
				point: '',
				timer: null,
			}
		},
		props: {
			loading: {
				default: false,
				type: Boolean
			},
			loadingText: {
				default: '加载中',
				type: String
			},
			bgColor: {
				default: '#ffffff',
				type: String
			},
		},
		created() {
			this.timer = setInterval(() => {
				if(this.point.length < 3) {
					this.point = this.point + '.'
				}else {
					this.point = '.'
				}
			}, 500)
		},
		beforeDestroy() {
			clearInterval(this.timer)
		},
		watch: {
			loading(newVal, oldVal) {
				if(newVal) {
					this.timer = setInterval(() => {
						if(this.point.length < 3) {
							this.point = this.point + '.'
						}else {
							this.point = '.'
						}
					}, 500)
				}else {
					clearInterval(this.timer)
				}
			},
		},
		methods: {
			
		}
	}
</script>
<style>
</style>
